import { initSocket } from "@/utils/socket";
import { useRoute } from "vue-router";
import { ref, watch, onUnmounted } from 'vue'


export default function useOnlineCount() {
    const route = useRoute()
    const socket = initSocket()
    const pageViewCount = ref(0) // 当前页面在线人数
    const totalOnlineCount = ref(0) // 全站在线人数

    /**
     * 设置Socket事件监听器
     * 功能：响应后端的人数更新事件
     */
    const setupListeners = () => {

        // 监听全站在线人数更新
        socket.on('totalOnlineCount', (count) => {
            totalOnlineCount.value = count
            console.log('全站人数在线更新：', count)
        })

        // 监听特定页面人数更新
        socket.on('pageViewCount', (count) => {
            pageViewCount.value = count
            console.log('页面人数更新：', count)
        })

        // 错误处理
        socket.on('connect_error', (err) => {
            console.error('连接错误:', err);
        });
    }

    /**
         * 发送当前页面信息到服务器
         * 功能：通知服务器用户进入了哪个页面
         */
    const sendPageInfo = (path) => {
        if (socket && path) {
            socket.emit('enterPage', path);
            console.log(`发送页面信息: ${path}`);
        }
    };

    // 组件挂载时初始化
    setupListeners();
    sendPageInfo(route.path);

    /**
     * 路由变化监听
     * 功能：当用户切换页面时自动更新
     */
    watch(() => route.path, (newPath) => {
        sendPageInfo(newPath);
    });

    /**
     * 组件卸载时的清理
     * 功能：移除事件监听防止内存泄漏
     */
    onUnmounted(() => {
        socket?.off('totalOnlineCount');
        socket?.off('pageViewCount');
        socket?.off('connect_error');
    });

    return {
        pageViewCount,     // 当前页面在线人数
        totalOnlineCount   // 全站在线人数
    }
}